アクセスのしやすさ
- 表示が速い方がアクセスしやすい
- レスポンシブ対応すればケータイからアクセスしやすい
- 多言語対応すれば他言語利用者がアクセスしやすい
- ServiceWorker を使えばオフラインでもアクセスできる
- などなど...
16~69歳の視覚障がい者の 91.7% が
インターネットを利用しています。
アクセスのしやすさ
W3C (World Wide Web Consortium) でアクセシビリティ関連の
標準化を行う組織 WAI (Web Accessibility Initiative) では
Web アクセシビリティを障がい者が Web を利用できること
と説明している
Web accessibility means that people with disabilities can use the Web.
W3C の狭義のアクセシビリティには反対意見も(強く)ある
反対勢力は「誰でもどんな環境でもアクセスしやすい」ことを
アクセシブル、その度合いをアクセシビリティと呼ぶ
当発表では「視覚障がい者によるアクセスのしやすさ」だけを扱う
主に音声読み上げソフトを利用
見え方や見えやすい条件に多様な個人差がある
Web 利用方法も様々
| PC-Talker | 41,040 円(税込) | 国内シェア 85.3% |
| JAWS | 153,360 円(税込) | |
| NVDA | 無料 | オープンソース |
| ナレーター | Windows 標準付属 | Ctrl + Win + Enter |
| VoiceOver | macOS, iOS 標準付属 |
| NetReaderⅡ | 30,240円(税込) | 要 PC-Talker |
| IBM Home Page Reader | 販売終了 | IE 6 まで |
| ALTAIR | 無料 | DL リンク切れ... |
もっとほしいひとには W3C によるガイドライン
Web Content Accessibility Guidelines (WCAG) 2.0
https://waic.jp/docs/WCAG20/Overview.html
パッと見ハードル高そうな印象を受けるけど文章は割と平易
ガイドライン 1.1 テキストによる代替: すべての非テキストコンテンツには、拡大印刷、点字、音声、シンボル、平易な言葉などの利用者が必要とする形式に変換できるように、テキストによる代替を提供すること。
ガイドライン 2.1 キーボード操作可能: すべての機能をキーボードから利用できるようにすること。
↑ こういうガイドラインが 12 コある
目次ぐらい目を通しても損にはならない
<button class="icon-button" aria-label="お気に入りに追加">
<i class="mdi mdi-star"></i>
</button><p>この要素は読み上げられます</p>
<p aria-hidden="true">この要素は読み上げられません</p>この要素は読み上げられます
この要素は読み上げられません
<div role="tablist" aria-label="Entertainment">
<button role="tab" aria-selected="true" aria-controls="nils-tab" id="nils">
Nils Frahm
</button>
<button role="tab" aria-selected="false" aria-controls="agnes-tab" id="agnes" tabindex="-1">
Agnes Obel
</button>
</div>
<div tabindex="0" role="tabpanel" id="nils-tab" aria-labelledby="nils">
<p>Nils Frahm is a German musician, composer and record producer based in Berlin. He is known for combining classical and electronic music and for an unconventional approach to the piano in which he mixes a grand piano, upright piano, Roland Juno-60, Rhodes piano, drum machine, and Moog Taurus.</p>
</div>
<div tabindex="0" role="tabpanel" id="agnes-tab" aria-labelledby="agnes" hidden="">
<p>Agnes Caroline Thaarup Obel is a Danish singer/songwriter. Her first album, Philharmonics, was released by PIAS Recordings on 4 October 2010 in Europe. Philharmonics was certified gold in June 2011 by the Belgian Entertainment Association (BEA) for sales of 10,000 Copies.</p>
</div>Nils Frahm is a German musician, composer and record producer based in Berlin. He is known for combining classical and electronic music and for an unconventional approach to the piano in which he mixes a grand piano, upright piano, Roland Juno-60, Rhodes piano, drum machine, and Moog Taurus.
Agnes Caroline Thaarup Obel is a Danish singer/songwriter. Her first album, Philharmonics, was released by PIAS Recordings on 4 October 2010 in Europe. Philharmonics was certified gold in June 2011 by the Belgian Entertainment Association (BEA) for sales of 10,000 Copies.
role 属性や aria-* 属性を規定する W3C 勧告
Accessible Rich Internet Applications (WAI-ARIA)
https://momdo.github.io/wai-aria-1.1/
要素にロール、ステート、プロパティを
付与するための属性の仕様定義
WAI-ARIA の使用ルールの 1 つは
なるべく WAI-ARIA 属性を使わず
HTML ネイティブの意味を使うこと
<div role="progressbar">より<progress>を使うこと)WAI-ARIA Authoring Practices 1.1
https://www.w3.org/TR/wai-aria-practices/
歪んだ文字画像を表示して文字に起こさせることで
利用者が人間であることを確認するツール
画像の代わりに音声を文字に起こす CAPTCHA もある
画像だけの CAPTCHA は視覚障がい者の大敵
チェックボックスをクリックするだけで
利用者が人間であることを確認するツール
マウスの動きなどから人間か機械かを判断するらしい
音声 CAPTCHA もオプションとして提供される
本編は以上です
豆知識で終わらせず
実践しましょう
(特に私自身)
視覚障害者のインターネット利用特性と問題分析:みんなのウェブ
http://barrierfree.nict.go.jp/accessibility/proof/report/blind/index.html
視覚障害者の携帯電話・スマートフォン・タブレット・パソコン利用状況調査2013: 新潟大学学術リポジトリ Nuar
http://dspace.lib.niigata-u.ac.jp/dspace/handle/10191/27807
盲目のiPhoneユーザーに聞いた、視覚を使わない驚きのスマホ操作術 | スタッフブログ | マイネ王
https://king.mineo.jp/magazines/special/387
このスライド資料は GitHub に置いてあります。
https://git.io/2017-11-25-presentation
スマホで見れますが 10MB (gzip: 6MB) ほどあるので通信量が気になる方は注意
というイベントの第1回が今月11日に開催されたらしい
動画配信されているので興味と暇があれば
Japan Accessibility Conference(JAC) vol.1
https://japan-a11y-conf.com/
最近『インクルーシブデザイン』という言葉を目にする
『アクセシブル』も『ユニバーサル』も『インクルーシブ』も
「多様な利用者・利用環境への配慮」という文脈を形成する意味で
同じように利用される
が、『インクルーシブデザイン』という言葉を選ぶときは
「障がい者や高齢者を巻き込んで一緒にデザインする」
という意味を込めたり込めなかったりする点に留意が必要
インクルーシブデザインの原則
(「Inclusive Design Principles」日本語訳)
http://inclusivedesignprinciples.org/ja/
↑ とても読みやすいアクセシビリティガイドラインになっているので
一読オススメ
日本の視覚障がい者数は約 34 万人
(2015 年末時点の手帳交付者数)
日本の視覚障がい認定基準は米国等と比べると厳しく
米国基準に照らせば約 164 万人になるとの試算も
(2007 年時点/日本眼科医会)
視覚障害がもたらす社会損失額、8.8兆円!!
http://www.gankaikai.or.jp/press/20091115_socialcost.pdf
認定基準の見直しが求められており 2017 年に厚生労働省で
「視覚障害の認定基準に関する検討会」が開催されている
視覚障害の認定基準に関する検討会 |厚生労働省
http://www.mhlw.go.jp/stf/shingi/other-syougai.html?tid=404284
2016年4月1日
障害を理由とする差別の解消の推進に関する法律(障害者差別解消法)が施行されました。
ちなみにどこかで見たような 5 段階評価表があったりもします
戦後一般的になった「障害」「障害者」という表記に対して
「害」という文字の印象が悪いから「障がい」表記にすると
一部の地方公共団体が言い出して論争になった
(2000年代前半頃~)
こういうのはだいたい言い出しっぺが悪い
もともと誰も「障害」という表記に特別な印象を抱てないのに、印象が悪いという主張が現れるとそう見える人が現れる
handicapped は印象が悪いと言って impaired, invalid, disabled, challenged, disability, survivor など新しい言葉を割り当てては混乱と論争を巻き起こすが、
どんなシニフィアン(表現)を選んでもシニフィエ(意味)側が時間とともに偏見を含むよう変化していくだけ
(その言葉を差別的な意味で使う人が現れる、あるいは差別的な意味で受け取る人が現れる)
内閣府による表記検討結果資料を見ると
歴史的変遷や各派閥の主張がまとまっていておもしろい
ちなみに
当発表では基本的に「障がい」表記とした(引用箇所を除く)
が、深い理由はない(十分な検討ができていない)